<template>
  <div>
    <BasicModal
      v-bind="$attrs"
      @register="registerModal"
      width="60%"
      title="查看详情"
      @ok="handleSubmit"
    >
      <Description @register="register" />
    </BasicModal>
  </div>
</template>

<script lang="ts">
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { defineComponent } from 'vue';
  import { Description, useDescription } from '/@/components/Description/index';
  import { ViewData, schema } from './personalManage.data';

  export default defineComponent({
    components: {
      Description,
      BasicModal,
    },
    setup() {
      // 模态框
      const [registerModal, { setModalProps, closeModal }] = useModalInner((data) => {
        setModalProps({ confirmLoading: false });
        console.log(data);
      });

      const [register] = useDescription({
        column: 3,
        data: ViewData,
        schema: schema,
      });

      const handleSubmit = () => {
        closeModal();
      };

      return {
        registerModal,
        handleSubmit,
        register,
      };
    },
  });
</script>

<style scoped lang=""></style>
